<template>
  <a-form ref="formRef" :model="formData.data" :label-col="labelCol" :rules="rules">
    <a-row>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.chineseName')" name="schoolCnName">
          <a-input v-model:value="formData.data.schoolCnName" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.englishName')" name="schoolEnName">
          <a-input v-model:value="formData.data.schoolEnName" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.abbreviations')">
          <a-input v-model:value="formData.data.schUniversityAbbreviation" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.nature')" name="schNature">
          <a-select v-model:value="formData.data.schNature" placeholder="请选择">
            <a-select-option v-for="item in dictLists.data[dictEnum.SCH_NATURE]" :value="item.value" :key="item.value">
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.head')">
          <a-input v-model:value="formData.data.schResponsiblePersonName" readonly @dblclick="openModal"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.category')" name="schCategory" :auto-link="false">
          <div class="box-ver-hor-between w-100p">
            <a-select v-model:value="formData.data.schCategory" placeholder="请选择">
              <a-select-option v-for="item in dictLists.data[dictEnum.SCH_TYPE]" :key="item.value" :value="item.value">
                {{ item.label }}
              </a-select-option>
            </a-select>
            <a-input v-if="Number(formData.data.schCategory) === 2"
                     v-model:value="formData.data.schCategoryOther"
                     placeholder="请输入"
                     class="ml-5p"
            />
          </div>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.websiteAddress')">
          <a-input v-model:value="formData.data.schOfficialWebsiteAddress" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.educationSystem')">
          <a-select v-model:value="formData.data.schSchoolSystem" placeholder="请选择">
            <a-select-option v-for="item in dictLists.data[dictEnum.SCH_SYSTEM]" :key="item.value" :value="item.value">
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.country')" name="schCountry">
          <a-input v-model:value="formData.data.schCountry" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.province')">
          <a-input v-model:value="formData.data.schProvince" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.city')">
          <a-input v-model:value="formData.data.schCity" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.street')">
          <a-input v-model:value="formData.data.schStreet" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.email')">
          <a-input v-model:value="formData.data.schMailbox" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.studentCount')">
          <a-input v-model:value="formData.data.schStuNumber" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.internationStudentCount')">
          <a-input v-model:value="formData.data.schInternationalStuNumber" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.tuitionFee')">
          <a-input v-model:value="formData.data.schTuition" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.isCooperation')">
          <a-select v-model:value="formData.data.schCompetitorYesno" placeholder="请选择">
            <a-select-option v-for="item in dictLists.data[dictEnum.YES_OR_NO]" :key="item.value" :value="item.value">
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :span="8" v-if="Number(formData.data.schCompetitorYesno) === 1">
        <a-form-item :label="t('school-manage.label.competitorDetail')">
          <a-input v-model:value="formData.data.schCompetitorDetails" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.intentionProject')">
          <a-select v-model:value="formData.data.schIntendedProject" placeholder="请选择">
            <a-select-option v-for="item in dictLists.data[dictEnum.Intention_PROJECT]"
                             :key="item.value"
                             :value="item.value"
            >
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.isOnlineClass')">
          <a-select v-model:value="formData.data.schOnlineYesno" placeholder="请选择">
            <a-select-option v-for="item in dictLists.data[dictEnum.YES_OR_NO]" :key="item.value" :value="item.value">
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.rank')">
          <a-input v-model:value="formData.data.schRanking" placeholder="请输入"/>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.followProgress')">
          <a-select v-model:value="formData.data.schFollowUpProgress" placeholder="请选择">
            <a-select-option v-for="item in dictLists.data[dictEnum.FOLLOW_PROGRESS]"
                             :key="item.value"
                             :value="item.value"
            >
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.startCooperationTime')">
          <a-date-picker v-model:value="formData.data.schStartCooperationTime"
                         valueFormat="yyyy-MM-DD"
                         type="date"
                         class="w-100p"
          />
        </a-form-item>
      </a-col>
      <a-col :span="8">
        <a-form-item :label="t('school-manage.label.setUpTime')">
          <a-date-picker v-model:value="formData.data.schEstablishmentTime"
                         valueFormat="yyyy-MM-DD"
                         type="date"
                         class="w-100p"
          />
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.tuitionFeeDetail')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schTuitionFees" placeholder="请输入" :rows="textareaRows"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.cooperationCollege')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schCooperationCollege" placeholder="请输入" :rows="textareaRows"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.openProfession')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schOpenMajor" placeholder="请输入" :rows="textareaRows"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.costSettlementConditions')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schExpenseSettlementConditions" placeholder="请输入"
                      :rows="textareaRows"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.courseCatalog')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schCourseCatalog" placeholder="请输入" :rows="textareaRows"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.dataBaseLink')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schDatabaseLink" placeholder="请输入" :rows="textareaRows"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item :label="t('school-manage.label.marketDetail')" :label-col="{ span: 3 }">
          <a-textarea v-model:value="formData.data.schMarketDetails" placeholder="请输入" :rows="textareaRows"/>
        </a-form-item>
      </a-col>
    </a-row>
  </a-form>
  <BasicTableModal v-model:visible="modalConfig.show"
                   :columns="modalConfig.columns"
                   :fetchAjax="page"
                   @selectUniversity="selectPerson"
  />
</template>

<script setup>
import { getDictByCodesReturnObj } from '@/tools/get-dict'
import { page } from '@/api/module/user'
import { defineExpose, reactive, ref, onMounted } from 'vue'
import { useI18n } from 'vue-i18n'
import dictEnum from "@/const/dict"
import BasicTableModal from '@/component/basic-table-modal'

const textareaRows = 3
const labelCol = { span: 9 }
const formRef = ref(null)
const formData = reactive({
  data: {}
})
const modalConfig = reactive({
  show: false,
  columns: [
    { dataIndex: "nickname", key: "nickname", title: "用户名称" },
    { dataIndex: "deptName", key: "deptName", title: "所属部门" },
    { dataIndex: "postName", key: "postName", title: "职位" },
  ]
})

const { t } = useI18n()

const openModal = () => {
  modalConfig.show = true
}

const selectPerson = record => {
  formData.data.schResponsiblePersonName = record.nickname
  formData.data.schResponsiblePerson = record.id
}

const categoryValidator = () => {
  if (formData.data.schCategory === null || formData.data.schCategory === undefined) {
    return Promise.reject('请选择类别')
  }

  if (formData.data.schCategory === 1 && (formData.data.otherCategory === null || formData.data.otherCategory === undefined || formData.data.otherCategory.length === 0)) {
    return Promise.reject('请输入其他类别')
  }

  return Promise.resolve()
}

const rules = {
  schoolCnName: [{ required: true, message: '请输入学校中文名' }],
  schoolEnName: [{ required: true, message: '请输入学校英文名' }],
  schNature: [{ required: true, message: '请选择性质' }],
  schCountry: [{ required: true, message: '请输入所属国家' }],
  schCategory: [{ required: true, validator: categoryValidator }]
}

const submit = () => {
  return new Promise(resolve => {
    formRef.value
      .validate()
      .then(() => {
        resolve(formData.data)
      })
  })
}

const dictLists = reactive({
  data: {},
  code: [
    dictEnum.YES_OR_NO,
    dictEnum.SCH_TYPE,
    dictEnum.SCH_SYSTEM,
    dictEnum.FOLLOW_PROGRESS,
    dictEnum.SCH_NATURE,
    dictEnum.Intention_PROJECT
  ]
})
onMounted(async () => {
  dictLists.data = await getDictByCodesReturnObj(dictLists.code)
})

const updateFormData = data => {
  formData.data = data
}

defineExpose({
  submit,
  updateFormData
})
</script>
